<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Cache-Control" content="no-cache" />
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<!-- <meta name="viewport" content="width=device-width, initial-scale=1" > -->
<link  type="text/css" rel="stylesheet" href="<{$web_host}>/common/clientapi/css/player.css" >
<title>html5电子白板播放器V2.1</title>
<script>
var site_url = "<{$video_name}>";
var url_domain = "<{$web_domain_url}>";
var aac_domain = "<{$web_domain_aac}>";
var video_time = "<{$video_time}>";
var item_info = "<{$item_info}>";
var web_url = "<{$web_host}>/common/clientapi/images/";
var aac_html_url = site_url + "/audio.aac";
</script>
<script type="text/javascript">
	function sound(){
		 var music = document.getElementById("audio");
		 music.play();
		 music.pause();
		 //ontouchstart="sound()"
	} 
</script>
</head>
<body>
<!-- <div id="title">html5电子白板播放器V2.0</div> -->
<div class="wrap">
<canvas id="myCanvas"  width="1024" height="693" >浏览器不支持</canvas>
<div id="menu">
	<div class="page_back"></div>
	<div id="play" class="play"  title="播放"></div>
	<div id="timeline"><div id="current-time"><i></i></div></div>
	<div id="time-view">
		<div id="time_now_l" class="time_now_left"><span id="h">00</span>:<span id="m">00</span>:<span id="s">00</span></div>
		<div id="no_need">/</div>
		<div id="total-time"><{$video_time}></div>
	</div>
</div>
</div>
<audio controls="controls" id="audio" style="display:none;">
	
</audio>
<div id = "item_info"><i id="back_button"></i><span id="video_info"></span></div>
<div id="wait_min"></div>
<script type="text/javascript" src="<{$web_host}>/common/libs/jquery-1.9.1.js"></script>
<script type="text/javascript" src="<{$web_host}>/common/libs/fastclick.js"></script>
<script type="text/javascript" src="<{$web_host}>/common/libs/player.js"></script>

<script type="text/javascript">
$(function(){
	 $("body").one("click", function(){
	    sound();
	 });
	 $("#item_info").hide();
	 $("#wait_min").hide();
	 FastClick.attach(document.body);
	 if($(window).width()<1000){
		$("#item_info").show();
		$("#video_info").html(item_info);
	 	$(".page_back").hide();
	 	
		var android_width = $(window).width();
		var android_heigh = $(window).height();
		var real_time = android_width - 300;
		var real_width = Math.round(4*android_heigh/3);
		var c_margin = (android_width-real_width)/2;
		
		$(".wrap").css({"width":android_width+"px","height":android_heigh+"px"});
		$("#myCanvas").css({"width":real_width+"px","height":android_heigh+"px","margin-left":c_margin+"px"});
		$("#timeline").css({"width":real_time+"px"});
		$("#menu").css({"width":android_width+"px"});
		$("#item_info").css({"width":android_width+"px"});
		
		$("#myCanvas").click(function(){
			if($("#item_info").is(":hidden")){
				$("#item_info").show();
				$("#menu").show();
			}else{
				$("#item_info").hide();
				$("#menu").hide();
			}
		});
		$("#wait_min").css({"left": android_width/2-10+"px","top": android_heigh/2-10+"px"});
		$("#back_button").click(function(){
			//Events.trigger("Kernel:Control:stop");
			//player.view.rand_stop();
			player.view.stop();
			window.VideoPlayActivity.openBack();
		});
			
	 }
});

</script>
</body>
</html>
